<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="layui/css/layui.css"  media="all">
 <script src="layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/vue.js"></script>
<title>Insert title here</title>
</head>
<body>
<div>
<i class="layui-icon" style="font-size: 25px; color: #1E9FFF;">&#xe614;</i> 
  <h2 style="display: inline;">系统管理<i class="layui-icon" style="font-size: 20px; color: #1E9FFF;">&#xe65b;</i>  我的桌面管理</h2>
  </div>
  <p>&nbsp;</p>
  <form class="layui-form" id="desk"> <!-- 提示：如果你不想用form，你可以换成div等任何一个普通元素 -->
   

  
  <div  class="layui-form-item">
    <label class="layui-form-label">自定义桌面</label>
    <div class="layui-input-block" id="check">
   <!--  <template v-for="desk in desklist">
    <template v-if="desk.state==1">
      <input type="checkbox" checked name="" :title="desk.name" :value="desk.id">
    </template>
    <template v-else>
      <input type="checkbox" name="" :title="desk.name" :value="desk.id">
    </template>
     </template> -->
     <input type="checkbox" name="" title="最新通告" value="1">
     <input type="checkbox" name="" title="待处理任务" value="2">
     <input type="checkbox" name="" title="我的便签" value="3">
     <input type="checkbox" name="" title="安排提醒" value="4">
     <input type="checkbox" name="" title="最新通告1" value="5">
    </div>
  </div>
  
  
  <div id="but" class="layui-form-item">
    <div class="layui-input-block">
      <button type="button" id="save" class="layui-btn">保存</button>
      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
  </div>
  <!-- 更多表单结构排版请移步文档左侧【页面元素-表单】一项阅览 -->
</form>



<script type="text/javascript">
layui.use('form', function(){
	  var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
	
	  form.render();
	}); 

	
var vue=new Vue({
	el:"#desk",
	data:{
		desklist:'',
	},
	methods:{
		
		}
	
	
	
});//vue
$(function(){
	
	
	$.ajax({
		url:'../desk/queryDesk',
		type:'post',
		data:{},
	 	dataType:"json",
	 	//async:false,
	 	success:function(result){
		console.log(result);
		//vue.desklist=result;
		$.each(result,function(index,ele){
			
			$("input[type='checkbox']").each(function(i){
				if(1==ele.state&&ele.id==$(this).val()){
					$(this).attr("checked",true);
				}
			})
			
		
		});
		
		
	 }
		
	});//ajax
	
	
	
	
});// function
$("#save").click(function(){
	var arr=[];  
       
	$("input[type='checkbox']").each(function(i){
		var id=$(this).val();//得到id
		console.log($(this).attr("checked"));
		
		/* if($(this).attr("checked")){
			arr[i]={"id":id,"state":1};
			
		}else{
			arr[i]={"id":id,"state":0};
		} */
	});
	console.log(arr);
	
	
});


</script>
</body>
</html>